<template>
  <div class="content">
    <top-label v-model="index">
      <span :slot="0">调洪演算</span>
      <span :slot="1">稳定性分析</span>
      <span :slot="2">排洪系统可靠性分析</span>
      <span :slot="3">安全现状分析</span>
    </top-label>
    <el-row>
      <flood-routing v-if="index === 0"></flood-routing>
      <stability-analy v-if="index === 1"></stability-analy>
      <having-the-system-analy v-if="index === 2"></having-the-system-analy>
      <analysis v-if="index === 3"></analysis>
    </el-row>
  </div>
</template>

<script>
import FloodRouting from "./pond-risk-assessment/FloodRouting";
import HavingTheSystemAnaly from "./pond-risk-assessment/HavingTheSystemAnaly";
import Analysis from "./pond-risk-assessment/Analysis";
import StabilityAnaly from "./pond-risk-assessment/StabilityAnaly";
import TopLabel from "../../components/TopLabel";
export default {
  name: "PondRiskAssessment",
  components: {
    FloodRouting,
    StabilityAnaly,
    HavingTheSystemAnaly,
    Analysis,
    TopLabel,
  },
  data() {
    return {
      index: 0,
      tailingPondId: null,
    };
  },
  created() {
    this.tailingPondId = sessionStorage.getItem("sensorId");
    // if (this.tailingPondId == 2 || this.tailingPondId == 1) {
    //   this.index = 0;
    // } else {
    //   this.index = 1;
    if (window.sessionStorage.getItem("indexsu2") != null) {
      this.index = Number(window.sessionStorage.getItem("indexsu2"));
      // if (this.index == 3 || this.index == 0) {
      //   this.index = 1;
      // }
      // }
    }
  },
  watch: {
    index: function (indexra, oldVal) {
      window.sessionStorage.setItem("indexsu2", indexra);
    },
  },
};
</script>

<style scoped>
.content {
  margin-left: 0.08rem;
  font-size: 0.07rem;
  height: 87vh;
}
</style>